<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>回调函数</title>
</head>

<body>
    <img src="https://img1.baidu.com/it/u=3108395991,3014709597&fm=26&fmt=auto" alt="">
    <button id="btn">改变图片</button>
    <script>
        //回调函数
        function changeView(imageUrl, callback) {
            // debugger;
            //获取图片对象
            var imageUrl = document.getElementsByTagName(imageUrl)[0];
            //回调
            callback(imageUrl)
        }

        //获取对象
        var btn = document.getElementById("btn");
        btn.onclick = function() {
            changeView("img", function(el) {
                    el.src = "https://img1.baidu.com/it/u=1680114464,2146442701&fm=26&fmt=auto"
                })
                //改变图片地址
                //imageUrl.src="https://img1.baidu.com/it/u=1680114464,2146442701&fm=26&fmt=auto"
        }
    </script>

    <script>
        //回调函数(将函数作为参数传递，并调用这个函数，就叫回调函数)
        function fn(callback, callback1) {
            //回调
            callback();
            callback1();
            console.log("fn函数");
        }
        //函数作为参数传递
        fn(fnCall, fnCall1);
        //要传递的函数
        function fnCall() {
            console.log("222");
        }

        function fnCall1() {
            console.log("33333");
        }
    </script>
</body>

</html>